<template>
  <div class="my-train">
    <div class="list">
      <div class="item">
        <div class="left">
          <p class="title">余额充值</p>
          <p class="time">2018.11.13 15:24</p>
        </div>
        <div class="right">
          <p class="title">+5次</p>
          <p class="time">剩余5次</p>
        </div>
      </div>
      <div class="item">
        <div class="left">
          <p class="title">余额充值</p>
          <p class="time">2018.11.13 15:24</p>
        </div>
        <div class="right">
          <p class="title">+5次</p>
          <p class="time">剩余5次</p>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
  export default {
    data () {
      return {
      }
    },
    created () {
    },
    methods: {
      router (path) {
        this.$router.push(path)
      },
    }
  }
</script>

<style lang="stylus" scoped>
.my-train
  background-color #f5f5f5
  min-height 100vh
  padding-bottom 5rem
  .list
    background-color #fff
    .item
      display flex
      height 7rem
      margin 0 1.6rem
      border-bottom 1px solid #e6e6e6
      &:last-child
        border none
      .title
        font-size 1.5rem
        color #333
        overflow hidden
        white-space nowrap
        text-overflow ellipsis
        line-height 2rem
        height 2rem
        margin-bottom .4rem
        margin-top 1.5rem
        width 25rem
      .time
        color #999
        font-size 1.2rem
        line-height 1.6rem
        height 1.6rem
      .left
        flex 3
      .right
        flex 1
        p
          width 100%
          text-align right
          margin-left 0
        .title
          color #FE9700
</style>
